<template>
	<G__TopNav/>
	<div>
		<button @click="loadData">加载所有数据</button>
	</div>
	<div>
		<button @click="addData">写入数据</button>
	</div>
</template>

<script lang="ts" setup>
import { getCurrentInstance, ComponentInternalInstance } from 'vue'

const {proxy} = getCurrentInstance() as ComponentInternalInstance
const $db = (proxy as any).$db;

function loadData() {
	$db.loadDatabase(); // 从数据库加载数据,
	console.log('$db', $db)
	console.log('$db.filename', $db.filename)
	$db.find({}, (err: any, newDoc: any) => {
		console.log('err', err)
		console.log('newDoc', newDoc)
	})
}

function addData() {
	console.group('addData');
	console.log('$db', $db)
	$db.insert({
		name: 'michael'
	}, (err: any, newDoc: any) => {
		console.log('err', err)
		console.log('newDoc', newDoc)
	})
	console.groupEnd();
}

</script>

<script lang="ts">
import { computed, defineComponent } from 'vue'
import { mapGetters, mapState, useStore } from "vuex";
import G__TopNav from "@/components/TopNav.vue";

export default defineComponent({
	name: "page__nedb",
	components: {G__TopNav},
	data() {
		return {
			num: 1234567
		}
	},

/*	methods: {
		loadData() {
			console.log('$db2', this.$db)
			// console.log('$db.filename', this.$db.filename)
			this.$db.find({}, (err: any, newDoc: any) => {
				console.log('err', err)
				console.log('newDoc', newDoc)
			})
		}
	},*/

	// mounted() {
	//
	// },

	setup() {
		// 组合是API中使用store
		const store = useStore()

		const storeX = computed(() => store.state.moduleA.x)

		return {
			storeX
		}
	}
})
</script>

<style scoped lang="less">

</style>
